﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm2.aspx.cs" Inherits="WebApplication1.WebForm2" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>直接弹出数据</title>
    <script src="Scripts/jquery-1.9.1.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            var ul = document.getElementById("tabs");
            var lis = ul.getElementsByTagName("li");
            var liIndex = 10;
            for (var i = 0; i < lis.length; i++) {
                lis[i].i = i;
                lis[i].onclick = function () {
                    //li的索引值+1，表示第几个超链接
                    liIndex = this.i + 1;

                    //给文本框赋值
                    $("#<%=txtMsg.ClientID %>").val(liIndex);

                    //弹出对话框
                    var msg = "你点击的是第" + liIndex + "个超链接！";
                    alert(msg);
                }
            };
        })
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <div style="color: red;font-size:25px;">
            直接点击超链接，弹出对话框
        </div>
        <div>
            <ul id="tabs">
                <li id="tab1Demo"><a href="#" name="#tab1">按实验日期查询</a></li>
                <li id="tab2Demo"><a href="#" name="#tab2">按实验室查询</a></li>
                <li id="tab3Demo"><a href="#" name="#tab3">按教师查询</a></li>
                <li id="tab4Demo"><a href="#" name="#tab4">按上课时间段查询</a></li>
                <li id="tab5Demo"><a href="#" name="#tab5">组合条件查询</a></li>
            </ul>
            <asp:HiddenField ID="myHiddenField" runat="server" />
            <asp:TextBox ID="txtMsg" runat="server"></asp:TextBox>
        </div>
    </div>
    </form>
</body>
</html>
